<!DOCTYPE html>
<html lang="ru">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />

    <link rel="preconnect" href="https://fonts.googleapis.com" />
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
    <link
      href="https://fonts.googleapis.com/css2?family=Lato:wght@700;900&family=Ubuntu:wght@400;700&display=swap"
      rel="stylesheet"
    />

    <title>CreateX</title>

    <link rel="stylesheet" href="index.css" />
    <link
      href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css"
      rel="stylesheet"
      integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN"
      crossorigin="anonymous"
    />
  </head>
  <body>
    <div class="wrapper">
      <header>
        <div class="our_work_background">
          <div class="_container">
            <nav class="navbar">
              <a href="index.html" class="nav-branding">
                <img src="img/logo.png" alt="logo" />
              </a>

              <ul class="nav-menu">
                <li class="nav-item">
                  <a href="#" class="nav-link">About Us</a>
                </li>
                <li class="nav-item">
                  <a href="services.html" class="nav-link">Services</a>
                </li>
                <li class="nav-item">
                  <a href="#" class="nav-link">Work</a>
                </li>
                <li class="nav-item">
                  <a href="#" class="nav-link">News</a>
                </li>
                <li class="nav-item">
                  <a href="#" class="nav-link">Contacts</a>
                </li>
              </ul>
              <div class="hamburger">
                <span class="bar"></span>
                <span class="bar"></span>
                <span class="bar"></span>
              </div>
            </nav>
            <div class="page__title">
              <h1 class="display__1">OUR WORK</h1>
              <div class="text__base__regular">
                Our portfolio represents 20 years of construction experience
                backed by a passion for perfect client service, quality and
                innovations in consctuction industry.
              </div>
            </div>
          </div>
        </div>
      </header>
      <main>
        <div class="portfolio">
          <div class="portfolio__container _container a">
            <div class="portfolio__card">
              <img
                src="img/cubes__building.png"
                alt="Не удалось загрузить изображение"
                class="portfolio__image"
              />
              <div class="portfolio__info">
                <div class="portfolio__info">
                  <p class="portfolio__subtitle lead-bold">Cubes Building</p>
                  <div class="portfolio__small-subtitle small-regular">
                    Business Centers
                  </div>
                  <a
                    href="#"
                    class="portfolio__button button button_color_transparent-orange"
                    >View project</a
                  >
                </div>
              </div>
            </div>
            <div class="portfolio__card">
              <img
                src="img/modern_cottage.png"
                alt="Не удалось загрузить изображение"
                class="portfolio__image"
              />
              <div class="portfolio__info">
                <div class="portfolio__info">
                  <p class="portfolio__subtitle lead-bold">Modern Cottage</p>
                  <div class="portfolio__small-subtitle small-regular">
                    Private houses
                  </div>
                  <a
                    href="#"
                    class="portfolio__button button button_color_transparent-orange"
                    >View project</a
                  >
                </div>
              </div>
            </div>
            <div class="portfolio__card">
              <img
                src="img/luxury_house.png"
                alt="Не удалось загрузить изображение"
                class="portfolio__image"
              />
              <div class="portfolio__info">
                <div class="portfolio__info">
                  <p class="portfolio__subtitle lead-bold">
                    Luxury Beach House
                  </p>
                  <div class="portfolio__small-subtitle small-regular">
                    Private houses
                  </div>
                  <a
                    href="#"
                    class="portfolio__button button button_color_transparent-orange"
                    >View project</a
                  >
                </div>
              </div>
            </div>
            <div class="portfolio__card">
              <img
                src="img/double_bedroom.png"
                alt="Не удалось загрузить изображение"
                class="portfolio__image"
              />
              <div class="portfolio__info">
                <div class="portfolio__info">
                  <p class="portfolio__subtitle lead-bold">
                    Modern Double Bedroom
                  </p>
                  <div class="portfolio__small-subtitle small-regular">
                    Apartments & flats
                  </div>
                  <a
                    href="#"
                    class="portfolio__button button button_color_transparent-orange"
                    >View project</a
                  >
                </div>
              </div>
            </div>
            <div class="portfolio__card">
              <img
                src="img/debdroo_with_decorations.png"
                alt="Не удалось загрузить изображение"
                class="portfolio__image"
              />
              <div class="portfolio__info">
                <div class="portfolio__info">
                  <p class="portfolio__subtitle lead-bold">
                    Kids Bedroom With Decorations
                  </p>
                  <div class="portfolio__small-subtitle small-regular">
                    Apartaments & flats
                  </div>
                  <a
                    href="#"
                    class="portfolio__button button button_color_transparent-orange"
                    >View project</a
                  >
                </div>
              </div>
            </div>
            <div class="portfolio__card">
              <img
                src="img/pencil_building.png"
                alt="Не удалось загрузить изображение"
                class="portfolio__image"
              />
              <div class="portfolio__info">
                <div class="portfolio__info">
                  <p class="portfolio__subtitle lead-bold">
                    The Pencil Building
                  </p>
                  <div class="portfolio__small-subtitle small-regular">
                    Stores & Malls
                  </div>
                  <a
                    href="#"
                    class="portfolio__button button button_color_transparent-orange"
                    >View project</a
                  >
                </div>
              </div>
            </div>
            <div class="portfolio__card">
              <img
                src="img/red_finger.png"
                alt="Не удалось загрузить изображение"
                class="portfolio__image"
              />
              <div class="portfolio__info">
                <div class="portfolio__info">
                  <p class="portfolio__subtitle lead-bold">
                    Red Finger Building
                  </p>
                  <div class="portfolio__small-subtitle small-regular">
                    Business Centers
                  </div>
                  <a
                    href="#"
                    class="portfolio__button button button_color_transparent-orange"
                    >View project</a
                  >
                </div>
              </div>
            </div>
            <div class="portfolio__card">
              <img
                src="img/scandinavian_style.png"
                alt="Не удалось загрузить изображение"
                class="portfolio__image"
              />
              <div class="portfolio__info">
                <div class="portfolio__info">
                  <p class="portfolio__subtitle lead-bold">
                    Scandinavian Style Interior
                  </p>
                  <div class="portfolio__small-subtitle small-regular">
                    Private houses
                  </div>
                  <a
                    href="#"
                    class="portfolio__button button button_color_transparent-orange"
                    >View project</a
                  >
                </div>
              </div>
            </div>
            <div class="portfolio__card">
              <img
                src="img/brown_and_gray.png"
                alt="Не удалось загрузить изображение"
                class="portfolio__image"
              />
              <div class="portfolio__info">
                <div class="portfolio__info">
                  <p class="portfolio__subtitle lead-bold">
                    Brown and Gray Painted House
                  </p>
                  <div class="portfolio__small-subtitle small-regular">
                    Private houses
                  </div>
                  <a
                    href="#"
                    class="portfolio__button button button_color_transparent-orange"
                    >View project</a
                  >
                </div>
              </div>
            </div>
          </div>
        </div>
        <div class="clients">
          <div class="_container">
            <h1 class="our__clients">Our clients</h1>
            <div class="client-logo">
              <a href="#" class="to__client">
                <img
                  src="img/InDepth Consulting Logo - Untitled Page.png"
                  alt=""
                  class="logo__img"
                />
              </a>
              <a href="#" class="to__client">
                <img
                  src="img/Higher Fit Logo - Untitled Page.png"
                  alt=""
                  class="logo__img"
                />
              </a>
              <a href="#" class="to__client">
                <img
                  src="img/Sentinal Consulting Logo.png"
                  alt=""
                  class="logo__img"
                />
              </a>
              <a href="#" class="to__client">
                <img src="img/Happy Home Logo.png" alt="" class="logo__img" />
              </a>
              <a href="#" class="to__client">
                <img src="img/For Sale Logo.png" alt="" class="logo__img" />
              </a>
              <a href="#" class="to__client">
                <img
                  src="img/Sunset Realty Logo.png"
                  alt=""
                  class="logo__img"
                />
              </a>
            </div>
          </div>
        </div>
      </main>
      <footer class="footer">
        <div class="footer-block _container">
          <div class="left-side__footer">
            <div class="logo_and_socials">
              <div class="img__logo">
                <img src="img/logo_bright.png" alt="logo" />
              </div>
              <div class="socials">
                <a class="socials_logo" href="">
                  <img src="img/Whatsapp.png" alt="" />
                </a>
                <a class="socials_logo" href="">
                  <img src="img/Messanger.png" alt="" />
                </a>
                <a class="socials_logo" href="">
                  <img src="img/Facebook.png" alt="" />
                </a>
                <a class="socials_logo" href="">
                  <img src="img/Twitter.png" alt="" />
                </a>
                <a class="socials_logo" href="">
                  <img src="img/YouTube.png" alt="" />
                </a>
              </div>
            </div>
            <div class="footer__text">
              Createx Construction Bureau has been successfully operating in the
              USA construction market since 2000. We are proud to offer you
              quality construction and exemplary service. Our mission is to set
              the highest standards for construction sphere.
            </div>
            <div class="contacts">
              <h4 class="footer__title">HEAD OFFICE</h4>
              <div class="footer__text__contacts">
                Address:<span class="footer__faded__text">
                  8502 Preston Rd. Inglewood, New York</span
                >
              </div>
              <div class="footer__text__contacts">
                Call:<span class="footer__faded__text"> (405) 555-0128</span>
              </div>
              <div class="footer__text__contacts">
                Email:<span class="footer__faded__text">
                  hello@createx.com</span
                >
              </div>
            </div>
            <div class="copyright">
              © All rights reserved. Made by CreateX Studio
            </div>
          </div>
          <div class="center-side__footer">
            <div class="who-we-are">
              <div class="footer__title">WHO WE ARE</div>
              <div class="links-block">
                <a class="links" href="">About Us</a>
                <a class="links" href="">Available Positions</a>
                <a class="links" href="">Contacts</a>
              </div>
            </div>
          </div>
          <div class="right-side__footer">
            <div class="subscribe">
              <div class="footer__title__right">Let’s stay in touch</div>
              <form class="footer__form">
                <input
                  type="text"
                  class="footer-main-block__input"
                  name="email"
                  id="email"
                  placeholder="Your email address "
                />
                <button class="footer-main-block__button" type="submit">
                  subscribe
                </button>
              </form>
              <div class="footer__text__right">
                *Subscribe to our newsletter to receive communications and early
                updates from Createx Construction Bureau.
              </div>
              <div class="experience">
                <div class="footer__title">OUR EXPERIENCE</div>
                <div class="links-block">
                  <a href="" class="links">Services</a>
                  <a href="" class="links">Work</a>
                  <a href="" class="links">News</a>
                </div>
              </div>
            </div>
          </div>
        </div>
      </footer>
    </div>
  </body>
</html>
